<template>
  <div class="bg-f6 h-full">
    <v2-header class="bg-f">
      <template  #left>
      </template>
      <div></div>
      <template  #right>
        <el-menu :default-active="menuActive" class="el-menu-demo" mode="horizontal" @select="handleSelect">
          <el-menu-item v-for="(item , index) in menu" :index="item.path" >{{item.name}}</el-menu-item>
        </el-menu>
      </template>
    </v2-header >
      <keep-alive>
        <router-view></router-view>
      </keep-alive>
  </div>
</template>

<script>
import v2Header from '@/components/v2-cps/v2-header'
import Constants from "@/Constants";
import {mapGetters} from "vuex"
export default {
  name: "leanHome",
  components:{
    v2Header
  },
  data(){
    return {
      menu:[
          {
            path: '/site',
            name: '首页'
          },
        {
          path: '/book',
          name: '笔记'
        },
        {
          path: '/gp',
          name: '股票'
        },
        {
          path: '/log',
          name: '日记'
        },
        {
          path: '/chat',
          name: 'chatGPT'
        },
        {
          path: '/admin/home',
          name: '后台管理'
        },
        {
          path: '/v2/tw',
          name: '小说推文'
        },
        {
          path: '/loginOut',
          name: '注销'
        }
      ]
    }
  },
  created() {

  },
  methods:{
    logout(){
      this.$store.dispatch("FedLogOut").then(()=>{
        this.$router.replace("/login")
      })

    },
    handleSelect(path){
      if(path === "/loginOut"){
        this.logout()
      }else {
        this.$router.push(path)
      }

    }
  },
  computed:{
    menuActive(){
      let path = this.$store.state.global.menuActive ;
      return path ;
    },

  }
}
</script>

<style scoped>
.el-menu--horizontal>.el-menu-item.is-active{
  border-bottom: 2px solid #409EFF !important;
  background-color: #fff!important;
  color: #333 !important;
}
.el-menu-demo.el-menu--horizontal.el-menu{
  border-bottom: none ;
}
</style>
